<template>
  <el-dialog
    class="md-editor-dialog"
    :visible.sync="visibleDialog"
    :modal="false"
    :show-close="false"
    :modal-append-to-body="false"
    fullscreen
    lock-scroll
  >
    <div id="md-editor"/>
  </el-dialog>
</template>

<script>
import Vditor from 'vditor'
import 'vditor/dist/index.css'
import UserService from '@/api/UserService'

export default {
  components: {},
  props: {
    visible: {
      required: true,
      type: Boolean,
      default: false
    },
    editContent: {
      type: String,
      default: ''
    },
    cacheKey: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      editor: ''
    }
  },
  computed: {
    visibleDialog: {
      get() {
        return this.visible
      },
      set(val) {
        this.$emit('update:visible', val)
      }
    }
  },
  created() {
  },
  mounted() {
    console.log(['process.env.VUE_APP_VDITOR_CDN', location.origin, process.env.VUE_APP_VDITOR_CDN])
    const tm = setTimeout(() => {
      this.editor = new Vditor('md-editor', {
        // debugger: process.env.VUE_APP_ENV !== 'production',
        mode: 'wysiwyg', // 可选模式：sv, ir, wysiwyg
        height: 500, // 编辑器总高度
        // minHeight: 500, // 编辑区域最小高度
        // width	: 500, // 编辑器总宽度，支持 %
        // placeholder: '', // 输入区域为空时的提示
        cdn: process.env.VUE_APP_VDITOR_CDN, // 配置自建 CDN 地址
        // cdn: 'https://unpkg.com/browse/vditor@3.8.13',
        undoDelay: 1000, // 历史记录间隔， 每 5s(5000) 缓存一次
        theme: 'classic', // 主题。默认值: 'classic' => "classic" | "dark";
        icon: 'ant', // 图标。默认值: 'ant'  => "ant" | "material";
        toolbarConfig: {
          pin: true, // 是否固定工具栏	。 默认值: false
          hide: false // 是否隐藏工具栏。 默认值: false
        },
        fullscreen: {index: 1111},
        outline: {
          enable: true, // 初始化是否展现大纲。 默认值:false
          position: 'left' // 大纲位置：'left', 'right'。 默认值:false'left'
        },
        after: () => { // 编辑器异步渲染完成后的回调方法
          this.editor.vditor.toolbar.elements.fullscreen.firstElementChild.click()
          if (this.editContent) {
            this.editor.setValue(this.editContent)
          } else if (!(this.editor.getValue() || '').trim()) {
            this.editor.setValue('# 从这里开始编辑资讯内容')
          }
        },
        toolbar: [
          {
            // hotkey: '', // 快捷键，格式为⇧⌘/⌘/⌥⌘
            name: 'save', // 唯一标示
            tip: '保存', // 提示
            tipPosition: 's', // 提示位置：'n', 'ne', 'nw', 's', 'se', 'sw', 'w', 'e'
            className: 'right', // 样式名
            // prefix:'' // 插入编辑器中的前缀
            // suffix:'' // 插入编辑器中的后缀
            icon: '<svg t="1650099479831" class="icon" viewBox="100 100 800 800" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2586" width="200" height="200"><path d="M814.805 128a51.179 51.179 0 0 1 51.179 51.179V844.01a51.179 51.179 0 0 1-51.179 51.157H201.173a51.179 51.179 0 0 1-51.178-51.157V179.179A51.179 51.179 0 0 1 201.173 128h613.654zM329.024 434.837a51.093 51.093 0 0 1-51.179-51.093V179.157h-76.672v664.854h613.76V179.179H738.22v204.48a51.179 51.179 0 0 1-51.179 51.178H329.024z m0-51.093h357.995V179.157H329.024v204.587z m357.91 204.501a25.557 25.557 0 1 1 0.085 51.072H329.024a25.536 25.536 0 1 1 0-51.072h357.91z" fill="#333333" p-id="2587"></path></svg>',
            click: () => { // 自定义按钮点击时触发的事件
              console.log(['保存', this.editor])
              this.$emit('ok', this.editor.getValue(), this.editor.getHTML())
              this.editor.clearCache()
            }
            // toolbar:[] // 子菜单
          },
          {name: 'undo', tipPosition: 's'},
          {name: 'redo', tipPosition: 's'},
          {
            // hotkey: '', // 快捷键，格式为⇧⌘/⌘/⌥⌘
            name: 'close', // 唯一标示
            tip: '关闭', // 提示
            tipPosition: 's', // 提示位置：'n', 'ne', 'nw', 's', 'se', 'sw', 'w', 'e'
            className: 'right', // 样式名
            // prefix:'' // 插入编辑器中的前缀
            // suffix:'' // 插入编辑器中的后缀
            // icon: '<svg t="1650111841536" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2566" width="200" height="200"><path d="M512 456.310154L94.247385 38.557538a39.542154 39.542154 0 0 0-55.689847 0 39.266462 39.266462 0 0 0 0 55.689847L456.310154 512 38.557538 929.752615a39.542154 39.542154 0 0 0 0 55.689847 39.266462 39.266462 0 0 0 55.689847 0L512 567.689846l417.752615 417.752616c15.163077 15.163077 40.290462 15.36 55.689847 0a39.266462 39.266462 0 0 0 0-55.689847L567.689846 512 985.442462 94.247385a39.542154 39.542154 0 0 0 0-55.689847 39.266462 39.266462 0 0 0-55.689847 0L512 456.310154z" p-id="2567"></path></svg>',
            icon: '<svg t="1650111866420" class="icon" viewBox="100 100 800 800" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2701" width="200" height="200"><path d="M576 512l277.333333 277.333333-64 64-277.333333-277.333333L234.666667 853.333333 170.666667 789.333333l277.333333-277.333333L170.666667 234.666667 234.666667 170.666667l277.333333 277.333333L789.333333 170.666667 853.333333 234.666667 576 512z" fill="#444444" p-id="2702"></path></svg>',
            click: () => { // 自定义按钮点击时触发的事件
              document.querySelector('body').setAttribute('style', ' overflow: auto !important;')
              this.visibleDialog = false
            }
            // toolbar:[] // 子菜单
          },
          '|',
          // {name: 'emoji', tipPosition: 's'},
          {name: 'headings', tipPosition: 's'},
          {name: 'bold', tipPosition: 's'},
          {name: 'italic', tipPosition: 's'},
          {name: 'strike', tipPosition: 's'},
          {name: 'link', tipPosition: 's'},
          {name: 'upload', tipPosition: 's'},
          '|',
          {name: 'table', tipPosition: 's'},
          {name: 'list', tipPosition: 's'},
          {name: 'ordered-list', tipPosition: 's'},
          {name: 'check', tipPosition: 's'},
          '|',
          {name: 'line', tipPosition: 's'},
          {name: 'quote', tipPosition: 's'},
          'inline-code',
          {name: 'code', tipPosition: 's'},
          '|',
          {name: 'edit-mode', tipPosition: 'e'},
          {name: 'both', tipPosition: 's'},
          {name: 'preview', tipPosition: 's'},
          {name: 'code-theme', tipPosition: 's'},
          {name: 'content-theme', tipPosition: 's'},
          {name: 'info', tipPosition: 's'},
          {name: 'help', tipPosition: 's'},
          {name: 'fullscreen', tipPosition: 's'}
          // 'outline',  'export', 'devtools','record', 'insert-after', 'insert-before', 'outdent', 'indent','br' '|'
        ],
        counter: {
          enable: true, // 是否启用计数器。 默认值:false
          max: 100000, // 允许输入的最大值
          type: 'markdown' // 统计类型：'markdown', 'text'
          // after: (length, counter) => { // 字数统计回调
          // }
        },
        cache: {
          enable: true, // 是否使用 localStorage 进行缓存
          id: 'vditor-' + (this.cacheKey || '')	// 缓存 key，第一个参数为元素且启用缓存时必填
          // after: (html) => {	// 缓存后的回调
          // }
        },
        preview: {
          delay: 1000, // 预览 debounce 毫秒间隔。 默认值:1000
          maxWidth: 700, // 预览区域最大宽度 默认值:	800
          mode: 'both', // 显示模式：both, editor 默认值:	both
          actions: ['desktop', 'mobile'],
          // actions: [ // ['mobile', 'desktop', 'tablet', 'mp-wechat', 'zhihu'],
          //   {key: 'mobile', text: '移动设备'},
          //   {key: 'desktop', text: '桌面设备'}
          // ],
          // url:'' , // md 解析请求
          // parse: () => { // 预览回调
          // },
          // transform: () => { // 渲染之前回调
          // }
          hljs: {
            enable: true, // 是否启用代码高亮	默认值:
            style: 'dracula', // 可选值参见: https://link.ld246.com/forward?goto=https%3A%2F%2Fxyproto.github.io%2Fsplash%2Fdocs%2Flonger%2Fall.html	默认值:github
            lineNumber: true // 是否启用行号,	默认值:false
          },
          markdown: {
            autoSpace: false, // 	自动空格。 默认值:false
            fixTermTypo: false, // 	自动矫正术语。 默认值:false
            toc: false, // 	插入目录。 默认值:false
            footnotes: true, // 	脚注。 默认值:true
            codeBlockPreview: true, // 	wysiwyg 和 ir 模式下是否对代码块进行渲染。 默认值:true
            mathBlockPreview: true, // 	wysiwyg 和 ir 模式下是否对数学公式进行渲染。 默认值:true
            paragraphBeginningSpace: false, // 	段落开头空两个。 默认值:false
            sanitize: true, // 	是否启用过滤 XSS。 默认值:true
            listStyle: false, // 	为列表添加 data-style 属性。 默认值:false
            linkBase: '', // 	链接相对路径前缀。 默认值:''
            linkPrefix: '', // 	链接强制前缀。 默认值:''
            mark: false //	启用 mark 标记。 默认值:false
          },
          theme: {
            current: 'ant-design', // 当前主题。 默认值:light
            // list: 'ant-design' // 可选主题列表 { "ant-design": "Ant Design", dark: "Dark", light: "Light", wechat: "WeChat" 。 默认值:
            path: `${process.env.VUE_APP_VDITOR_CDN}/dist/css/content-theme` // 当前主题。 默认值: https://cdn.jsdelivr.net/npm/vditor@${VDITOR_VERSION}/dist/css/content-theme
          }
        },
        upload: {
          url: `${process.env.VUE_APP_BASE_API}/upload/reals`, // 	上传 url，为空则不会触发上传相关事件。 默认值:''
          multiple: true, // 	上传文件是否为多个。 默认值:true
          fieldName: 'files',	// 上传字段名称。 默认值:'file[]'
          max: 10 * 1024 * 1024, // 	上传文件最大 Byte	。 默认值: 10*1024*1024
          // linkToImgUrl:'', // 	剪切板中包含图片地址时，使用此 url 重新上传。 默认值:''
          // linkToImgCallback(responseText: string)	图片地址上传回调	-
          // linkToImgFormat(responseText: string): string	对图片地址上传的返回值进行格式化	-
          // token:'', // 	CORS 上传验证，头为 X-Upload-Token。 默认值:-
          // withCredentials:false, // 	跨站点访问控制。 默认值:false
          // accept: 'image/*', // 	文件上传类型，同 input accept。 默认值:-
          headers: { // 	请求头设置。 默认值:-
            ...UserService.getTokenHeader()
          },
          // success: (editor, msg) => {//	上传成功回调	-
          //   console.log(['success', editor, msg])
          // },
          error: (msg) => { //	上传失败回调	-
            console.error(['error', msg])
          },
          // filename: (name) => { //	文件名安全处理	name => name.replace(/\W/g, '')
          // },
          // validate: (files) => { //	校验，成功时返回 true 否则返回错误信息	-
          // },
          // handler: (files) => {//	自定义上传，当发生错误时返回错误信息	-
          // },
          format: (files, responseText) => { //	对服务端返回的数据进行转换，以满足内置的数据结构	-
            const uploadFileNames = []
            for (const file of files) {
              uploadFileNames.push(file.name)
            }
            const {data} = JSON.parse(responseText)
            const names = data.map(row => row.name)
            console.log(['format', uploadFileNames, names, files, responseText])
            return JSON.stringify({
              msg: '',
              code: 0,
              data: {
                errFiles: uploadFileNames.filter(name => !names.includes(name)),
                succMap: data.map(row => ({[row.name]: row.miniUrl || row.url})).reduce((a, b) => Object.assign(a, b), {})
              }
            })
          }
          // file: (files) => {//	将上传的文件处理后再返回	-
          // }
          // setHeaders(): { [key: string]: string }	上传前使用返回值设置头	-
          // extraData: { [key: string]: string | Blob }	为 FormData 添加额外的参数	-
        }
        // input:(value)=> { // 输入后触发
        // },
        // focus:(value)=> { // 聚焦后触发
        // },
        // blur:(value)=> { // 失焦后触发
        // },
        // esc:(value)=> { // esc 按下后触发
        // },
        // ctrlEnter:(value)=> { // ⌘/ctrl+enter 按下后触发
        // },
        // select:(value)=> { // 编辑器中选中文字后触发
        // }
        // 编辑器初始化值。默认值: ''
//       value: `Vditor 是一款**所见即所得**编辑器，支持 *Markdown*。
//
// * 不熟悉 Markdown 可使用工具栏或快捷键进行排版
// * 熟悉 Markdown 可直接排版，也可切换为分屏预览
//
// 更多细节和用法请参考 [Vditor - 浏览器端的 Markdown 编辑器](https://ld246.com/article/1549638745630)，同时也欢迎向我们提出建议或报告问题，谢谢 ❤️
//
// ## 教程
//
// 这是一篇讲解如何正确使用 **Markdown** 的排版示例，学会这个很有必要，能让你的文章有更佳清晰的排版。
//
// > 引用文本：Markdown is a text formatting syntax inspired
//
// ## 语法指导
//
// ### 普通内容
//
// 这段内容展示了在内容里面一些排版格式，比如：
//
// - **加粗** - \`**加粗**\`
// - *倾斜* - \`*倾斜*\`
// - ~~删除线~~ - \`~~删除线~~\`
// - \`Code 标记\` - \`\` \`Code 标记\` \`\`
// - [超级链接](https://ld246.com) - \`[超级链接](https://ld246.com)\`
// - [username@gmail.com](mailto:username@gmail.com) - \`[username@gmail.com](mailto:username@gmail.com)\`
//
// ### 提及用户
//
// @Vanessa 通过 \`@User\` 可以在内容中提及用户，被提及的用户将会收到系统通知。
//
// > NOTE:
// >
// > 1. @用户名之后需要有一个空格
// > 2. 新手没有艾特的功能权限
//
// ### 表情符号 Emoji
//
// 支持大部分标准的表情符号，可使用输入法直接输入，也可手动输入字符格式。通过输入 \`:\` 触发自动完成，可在个人设置中[设置常用表情](https://ld246.com/settings/function)。
//
// #### 一些表情例子
//
// 😄 😆 😵 😭 😰 😅  😢 😤 😍 😌
// 👍 👎 💯 👏 🔔 🎁 ❓ 💣 ❤️ ☕️ 🌀 🙇 💋 🙏 💢
//
// ### 大标题 - Heading 3
//
// 你可以选择使用 H1 至 H6，使用 ##(N) 打头。建议帖子或回帖中的顶级标题使用 Heading 3，不要使用 1 或 2，因为 1 是系统站点级，2 是帖子标题级。
//
// > NOTE: 别忘了 # 后面需要有空格！
//
// #### Heading 4
//
// ##### Heading 5
//
// ###### Heading 6
//
// ### 图片
//
// \`\`\`
// ![alt 文本](http://image-path.png)
// ![alt 文本](http://image-path.png "图片 Title 值")
// \`\`\`
//
// 支持复制粘贴直接上传。
//
// ### 代码块
//
// #### 普通
//
// \`\`\`
// *emphasize*    **strong**
// _emphasize_    __strong__
// var a = 1
// \`\`\`
//
// #### 语法高亮支持
//
// 如果在 \`\`\` 后面跟随语言名称，可以有语法高亮的效果哦，比如:
//
// ##### 演示 Go 代码高亮
//
// \`\`\`go
// package main
//
// import "fmt"
//
// func main() {
// \tfmt.Println("Hello, 世界")
// }
// \`\`\`
//
// ##### 演示 Java 高亮
//
// \`\`\`java
// public class HelloWorld {
//
//     public static void main(String[] args) {
//         System.out.println("Hello World!");
//     }
//
// }
// \`\`\`
//
// > Tip: 语言名称支持下面这些: \`ruby\`, \`python\`, \`js\`, \`html\`, \`erb\`, \`css\`, \`coffee\`, \`bash\`, \`json\`, \`yml\`, \`xml\` ...
//
// ### 有序、无序、任务列表
//
// #### 无序列表
//
// - Java
//   - Spring
//     - IoC
//     - AOP
// - Go
//   - gofmt
//   - Wide
// - Node.js
//   - Koa
//   - Express
//
// #### 有序列表
//
// 1. Node.js
//    1. Express
//    2. Koa
//    3. Sails
// 2. Go
//    1. gofmt
//    2. Wide
// 3. Java
//    1. Latke
//    2. IDEA
//
// #### 任务列表
//
// - [X] 发布 Sym
// - [X] 发布 Solo
// - [ ] 预约牙医
//
// ### 表格
//
// 如果需要展示数据什么的，可以选择使用表格。
//
// | header 1 | header 2 |
// | -------- | -------- |
// | cell 1   | cell 2   |
// | cell 3   | cell 4   |
// | cell 5   | cell 6   |
//
// ### 隐藏细节
//
// <details>
// <summary>这里是摘要部分。</summary>
// 这里是细节部分。
// </details>
//
// ### 段落
//
// 空行可以将内容进行分段，便于阅读。（这是第一段）
//
// 使用空行在 Markdown 排版中相当重要。（这是第二段）
//
// ### 链接引用
//
// [链接文本][链接标识]
//
// [链接标识]: https://b3log.org
// \`\`\`
// [链接文本][链接标识]
//
// [链接标识]: https://b3log.org
// \`\`\`
//
// ### 数学公式
//
// 多行公式块：
//
// $$
// \\frac{1}{
//   \\Bigl(\\sqrt{\\phi \\sqrt{5}}-\\phi\\Bigr) e^{
//   \\frac25 \\pi}} = 1+\\frac{e^{-2\\pi}} {1+\\frac{e^{-4\\pi}} {
//     1+\\frac{e^{-6\\pi}}
//     {1+\\frac{e^{-8\\pi}}{1+\\cdots}}
//   }
// }
// $$
//
// 行内公式：
//
// 公式 $a^2 + b^2 = \\color{red}c^2$ 是行内。
//
// ### 脑图
//
// \`\`\`mindmap
// - 教程
// - 语法指导
//   - 普通内容
//   - 提及用户
//   - 表情符号 Emoji
//     - 一些表情例子
//   - 大标题 - Heading 3
//     - Heading 4
//       - Heading 5
//         - Heading 6
//   - 图片
//   - 代码块
//     - 普通
//     - 语法高亮支持
//       - 演示 Go 代码高亮
//       - 演示 Java 高亮
//   - 有序、无序、任务列表
//     - 无序列表
//     - 有序列表
//     - 任务列表
//   - 表格
//   - 隐藏细节
//   - 段落
//   - 链接引用
//   - 数学公式
//   - 脑图
//   - 流程图
//   - 时序图
//   - 甘特图
//   - 图表
//   - 五线谱
//   - Graphviz
//   - 多媒体
//   - 脚注
// - 快捷键
// \`\`\`
//
// ### 流程图
//
// \`\`\`mermaid
// graph TB
//     c1-->a2
//     subgraph one
//     a1-->a2
//     end
//     subgraph two
//     b1-->b2
//     end
//     subgraph three
//     c1-->c2
//     end
// \`\`\`
//
// ### 时序图
//
// \`\`\`mermaid
// sequenceDiagram
//     Alice->>John: Hello John, how are you?
//     loop Every minute
//         John-->>Alice: Great!
//     end
// \`\`\`
//
// ### 甘特图
//
// \`\`\`mermaid
// gantt
//     title A Gantt Diagram
//     dateFormat  YYYY-MM-DD
//     section Section
//     A task           :a1, 2019-01-01, 30d
//     Another task     :after a1  , 20d
//     section Another
//     Task in sec      :2019-01-12  , 12d
//     another task      : 24d
// \`\`\`
//
// ### 图表
//
// \`\`\`echarts
// {
//   "title": { "text": "最近 30 天" },
//   "tooltip": { "trigger": "axis", "axisPointer": { "lineStyle": { "width": 0 } } },
//   "legend": { "data": ["帖子", "用户", "回帖"] },
//   "xAxis": [{
//       "type": "category",
//       "boundaryGap": false,
//       "data": ["2019-05-08","2019-05-09","2019-05-10","2019-05-11","2019-05-12","2019-05-13","2019-05-14","2019-05-15","2019-05-16","2019-05-17","2019-05-18","2019-05-19","2019-05-20","2019-05-21","2019-05-22","2019-05-23","2019-05-24","2019-05-25","2019-05-26","2019-05-27","2019-05-28","2019-05-29","2019-05-30","2019-05-31","2019-06-01","2019-06-02","2019-06-03","2019-06-04","2019-06-05","2019-06-06","2019-06-07"],
//       "axisTick": { "show": false },
//       "axisLine": { "show": false }
//   }],
//   "yAxis": [{ "type": "value", "axisTick": { "show": false }, "axisLine": { "show": false }, "splitLine": { "lineStyle": { "color": "rgba(0, 0, 0, .38)", "type": "dashed" } } }],
//   "series": [
//     {
//       "name": "帖子", "type": "line", "smooth": true, "itemStyle": { "color": "#d23f31" }, "areaStyle": { "normal": {} }, "z": 3,
//       "data": ["18","14","22","9","7","18","10","12","13","16","6","9","15","15","12","15","8","14","9","10","29","22","14","22","9","10","15","9","9","15","0"]
//     },
//     {
//       "name": "用户", "type": "line", "smooth": true, "itemStyle": { "color": "#f1e05a" }, "areaStyle": { "normal": {} }, "z": 2,
//       "data": ["31","33","30","23","16","29","23","37","41","29","16","13","39","23","38","136","89","35","22","50","57","47","36","59","14","23","46","44","51","43","0"]
//     },
//     {
//       "name": "回帖", "type": "line", "smooth": true, "itemStyle": { "color": "#4285f4" }, "areaStyle": { "normal": {} }, "z": 1,
//       "data": ["35","42","73","15","43","58","55","35","46","87","36","15","44","76","130","73","50","20","21","54","48","73","60","89","26","27","70","63","55","37","0"]
//     }
//   ]
// }
// \`\`\`
//
// ### 五线谱
//
// \`\`\`abc
// X: 24
// T: Clouds Thicken
// C: Paul Rosen
// S: Copyright 2005, Paul Rosen
// M: 6/8
// L: 1/8
// Q: 3/8=116
// R: Creepy Jig
// K: Em
// |:"Em"EEE E2G|"C7"_B2A G2F|"Em"EEE E2G|\\
// "C7"_B2A "B7"=B3|"Em"EEE E2G|
// "C7"_B2A G2F|"Em"GFE "D (Bm7)"F2D|\\
// 1"Em"E3-E3:|2"Em"E3-E2B|:"Em"e2e gfe|
// "G"g2ab3|"Em"gfeg2e|"D"fedB2A|"Em"e2e gfe|\\
// "G"g2ab3|"Em"gfe"D"f2d|"Em"e3-e3:|
// \`\`\`
//
// ### Graphviz
//
// \`\`\`graphviz
// digraph finite_state_machine {
//     rankdir=LR;
//     size="8,5"
//     node [shape = doublecircle]; S;
//     node [shape = point ]; qi
//
//     node [shape = circle];
//     qi -> S;
//     S  -> q1 [ label = "a" ];
//     S  -> S  [ label = "a" ];
//     q1 -> S  [ label = "a" ];
//     q1 -> q2 [ label = "ddb" ];
//     q2 -> q1 [ label = "b" ];
//     q2 -> q2 [ label = "b" ];
// }
// \`\`\`
//
// ### Flowchart
//
// \`\`\`flowchart
// st=>start: Start
// op=>operation: Your Operation
// cond=>condition: Yes or No?
// e=>end
//
// st->op->cond
// cond(yes)->e
// cond(no)->op
// \`\`\`
//
// ### 多媒体
//
// 支持 v.qq.com，youtube.com，youku.com，coub.com，facebook.com/video，dailymotion.com，.mp4，.m4v，.ogg，.ogv，.webm，.mp3，.wav 链接解析
//
// https://v.qq.com/x/cover/zf2z0xpqcculhcz/y0016tj0qvh.html
//
// ### 脚注
//
// 这里是一个脚注引用[^1]，这里是另一个脚注引用[^bignote]。
//
// [^1]: 第一个脚注定义。
//
// [^bignote]: 脚注定义可使用多段内容。
//
//        缩进对齐的段落包含在这个脚注定义内。
//
//        \`\`\`
//        可以使用代码块。
//        \`\`\`
//        还有其他行级排版语法，比如**加粗**和[链接](https://b3log.org)。
//
// \`\`\`
// 这里是一个脚注引用[^1]，这里是另一个脚注引用[^bignote]。
// [^1]: 第一个脚注定义。
// [^bignote]: 脚注定义可使用多段内容。
//
//     缩进对齐的段落包含在这个脚注定义内。
//
//     \`\`\`
//     可以使用代码块。
//     \`\`\`
//
//     还有其他行级排版语法，比如**加粗**和[链接](https://b3log.org)。
// \`\`\`
//
// ## 快捷键
//
// 我们的编辑器支持很多快捷键，具体请参考 [键盘快捷键](https://ld246.com/article/1474030007391)（或者按 "\`?\` "😼）
// `,
      })
      clearTimeout(tm)
    }, 100)
  }
}
</script>

<style scoped>
.md-editor-dialog >>> .el-dialog__header {
  display: none;
}

.md-editor-dialog >>> .el-dialog__body {
  padding: 0 !important;
}
</style>
